<template>
	<view class="box">
		<!-- 头像区域 -->
		<view class="login">
			<view class="login_portrait">
				<image src="/static/my/410.png" mode=""></image>
			</view>
			<view class="login_portrait_text">
				<view class="login_portrait_text_ID" @tap="getLogin" v-if="!isLogin">{{userid || '点击登录'}}</view>
				<view class="login_portrait_text_ID" v-if="isLogin">{{ 'ID:' + userid }}
					<image style="width: 33rpx;height: 33rpx;margin-left: 20rpx;" src="/static/my/copy.png" mode=""
						@click="copyId(userid)">
					</image>
				</view>
				<view class="login_portrait_text_VIP" v-if="!ban">
					{{ !isVip ?    '可体验次数：' + coins + '条':'到期时间：' + vip.vipendtime  }}
				</view>
				<view class="login_portrait_text_VIP" v-if="ban">
					账号违规已封禁
				</view>
			</view>
			<view class="refresh" @click="refreshNum">{{ refresh }}</view>
		</view>
		<!-- 跳转充值 -->
		<view class="enlighten_vip">
			<button class="button" @click="goMemberCenteres" default>{{isVip? '查看权限':'会员中心'}}</button>
			<image src="../../static/my/2e.png" mode="" @click="goMemberCenteres"></image>
			<view class="vip-s">
				<u-grid :border="false" col="4" @click="click">
					<u-grid-item v-for="(listItem,listIndex) in list" :key="listIndex">
						<u-icon :customStyle="{height:'80rpx',width:'80rpx'}" :name="listItem.name"></u-icon>
						<text class="grid-text">{{listItem.title}}</text>
					</u-grid-item>
				</u-grid>
				<u-toast ref="uToast" />
			</view>
		</view>

		<view class="cell_groups">
			<u-cell-group>
				<u-cell @click="goMemberCenteres" title="会员充值" :border="false" :isLink="true" size="large"
					:clickable='true'>
					<u-icon slot="icon" size="24" name="/static/my/my_hycz.png"></u-icon>
				</u-cell>
				<u-cell title="订单中心" :isLink="true" :border="false" size="large" @click="older">
					<u-icon slot="icon" size="24" name="/static/my/3x.png"></u-icon>
				</u-cell>
				<u-cell title="消费记录" :isLink="true" :border="false" size="large" @click="goConsumption">
					<u-icon slot="icon" size="24" name="/static/my/my_xfjl.png"></u-icon>
				</u-cell>
				<u-cell title="联系客服" :isLink="true" :border="false" size="large">
					<u-icon slot="icon" size="24" name="/static/my/my_lxkf.png"></u-icon>
				</u-cell>
				<u-cell title="任务佣金" :isLink="true" :border="false" size="large" @click="gogzh">
					<u-icon slot="icon" size="24" name="/static/my/11.png"></u-icon>
				</u-cell>
				<u-cell title="小程序使用教程" :isLink="true" :border="false" size="large" @click="gowebview">
					<u-icon slot="icon" size="24" name="/static/my/2p.png"></u-icon>
				</u-cell>
				<button type="primary" size="40" :session-from="'nickName=' + userid" open-type="contact"
					style="width: 100%;background: #00000000;position: absolute;top:326rpx;">.
				</button>
				
			</u-cell-group>
			<image src="https://iflytts.oss-cn-qingdao.aliyuncs.com/website/img/webway/ewm.png" mode="widthFix" style="width: 700rpx;"
			@click="tiimage"
			></image>
		</view>
		<view class="version">{{version}}</view>
	</view>
</template>

<script>
	import {
		isLogin,
		vipType,
		dologin
	} from '@/business/login.js';
	import {
		grayControl
	} from '@/utils/grayControl.js'
	import {
		apiMixUrlApi
	} from "@/api/assemb";

	export default {
		data() {
			return {
				list: [{
						id: '1',
						name: '/static/my/2h.png',
						title: 'AI写作'
					},
					{
						id: '2',
						name: '/static/my/2g.png',
						title: '伪原创'
					},
					{
						id: '3',
						name: '/static/my/2f.png',
						title: '推广赚钱'
					},
					{
						id: '4',
						name: '/static/my/2i.png',
						title: '赚会员'
					},

				],
				// noios: true,
				src: '/static/my/tx_w.png',
				isLogin: false, //是否登录
				isVip: false, //是否会员
				vip: {}, //会员 信息
				UserProfile: '', // 微信 用户信息
				userid: '', // 获取用户id
				refresh: '刷新会员',
				currentTime: 11,
				version: '',
				coins: 0,
				ban:false
			};
		},
		onShow() {
			if (uni.getStorageSync('ban')) {
				this.ban = true
			}else{
				this.ban = false
			}
			
			if (uni.getStorageSync('service')) {
				this.refreshNum()
			}

			this.isVip = uni.getStorageSync('vipType').vipStatus == 1 ? true : false;
			this.isLogin = isLogin();
			if (this.isLogin) {
				this.UserProfile = uni.getStorageSync('UserProfile');
				this.userid = uni.getStorageSync('baseinfo').userid;
				this.vip = uni.getStorageSync('vipType');
				grayControl()
				console.log(getApp().globalData.iosPay, '网页充值跟公众号充值的开关')
			} else {
				this.userid = uni.getStorageSync('baseinfo').userid;
			}
			if (uni.getAccountInfoSync().miniProgram.version) {
				this.version = 'v' + uni.getAccountInfoSync().miniProgram.version
			}

			this.getEarnCoins();
		},
		onLoad() {
			//判断当前账号是否封禁
		
			setInterval(() => {
				this.refreshNum()
			}, 5 * 60 * 60 * 1000)

			if (!this.isLogin) {
				setTimeout(() => {
					this.getLogin()
				}, 2000)
			}
		},
		onShareAppMessage: function(res) {
			const that = this
			let userid = uni.getStorageSync('baseinfo').userid
			if (res.from === 'button') { // 来自页面内分享按钮
				console.log(res.target, 'res.target')
			}
			return {
				title: 'AI写作神器，一键改写变原创。',
				path: "pages/home/home?userid=" + userid,
				imageUrl: "https://iflytts.oss-cn-qingdao.aliyuncs.com/wxapp/xze/6.png",
				success: function(res) {
					console.log(
						"--------------转发成功--------------------",
						res,
						userid
					);
				}
			}
		},
		onShareTimeline: function(res) {},
		methods: {
			//判断账号是否封禁
            prohibit(){
				let that = this
				apiMixUrlApi({}, 1113, 'GetUserStatus').then(data => {
					if(data.users[0].status == 1){
						uni.showModal({
							icon:'none',
							title:'账号已被封禁，请联系客服处理'
						})
						uni.setStorageSync("ban", true);
						that.ban = true
					}else{
					   uni.removeStorageSync('ban')
					   that.ban = false
					}
				}); 
			},			
			tiimage(){
					wx.previewImage({
						current:'https://iflytts.oss-cn-qingdao.aliyuncs.com/qrCode/y.jpg', // 图片的地址url
						urls: ['https://iflytts.oss-cn-qingdao.aliyuncs.com/qrCode/y.jpg'] // 预览的地址url
					})
			},
			gogzh(){
				uni.navigateTo({
					url: "/pages/markMoney/Money"
				})
			},
			// 点击登录
			getLogin() {
				if (this.userid == "") {
					dologin();
					this.isLogin = isLogin();
					if (this.isLogin) {
						this.UserProfile = uni.getStorageSync('UserProfile');
						this.userid = uni.getStorageSync('baseinfo').userid;
						this.vip = uni.getStorageSync('vipType');
						grayControl()
					} else {
						this.userid = uni.getStorageSync('baseinfo').userid;
					}
					this.refreshNum();
					this.getEarnCoins();
				}
			},
			// 获取剩余次数
			getEarnCoins() {
				apiMixUrlApi({}, 1042, 'GetPaymentInfo').then(data => {
					if (data.descinfo == "success") {
						this.coins = data.coins;
						uni.setStorageSync('frequency', data.coins)
					}
				});
			},
			click(name) {
				switch (name) {
					case 0:2
						console.log('1111')
						uni.navigateTo({
							url: '/pages_aiTools/creation/creation'
						});
						break;
					case 1:
						console.log('222')
						uni.navigateTo({
							url: '/pages_aiTools/aiWriting/aiWriting'
						});
						break;
					case 2:
						console.log('3333')
						uni.navigateTo({
							url: "/pages/markMoney/markMoneys"
						});
						break;
					case 3:
						console.log('444')
						uni.navigateTo({
							url: "/pages/newmedia/newmedia"
						});
						break;

					default:
						break;
				}
			},
			// 复制ID
			copyId(e) {
				uni.setClipboardData({
					data: e, // e是需要设置的内容
					success: function() {
						uni.showToast({
							title: '复制成功',
							icon: 'none'
						})
					}
				})
			},
			refreshNum: function() {
				if (this.refresh == '刷新会员') {
					var _this = this;
					let interval = null;
					vipType(false);
					let currentTime = _this.currentTime;
					interval = setInterval(function() {
						currentTime--;
						_this.refresh = currentTime;
						_this.isVip = uni.getStorageSync('vipType').vipStatus == 1 ? true : false;
						_this.vip = uni.getStorageSync('vipType')
						if (currentTime <= 0) {
							clearInterval(interval);
							_this.refresh = '刷新会员';
							_this.currentTime = 11;
						}
					}, 1000);
					if (uni.getStorageSync('service')) {
						uni.removeStorageSync('service');
					}
				}
				_this.prohibit()
			},
			//首页图片点击控制按钮
			goMemberCenteres() {
				if (uni.getStorageSync('OS') !== 'ios') {
						uni.navigateTo({
							url: '/pages/paymentCenter/paymentCenter'
						});
					}else{
						if (getApp().globalData.iosPay == 0) {
								console.log(getApp().globalData.iosPay)
							//跳转网页充值
							uni.navigateTo({
								url: '/pages/goods/goods'
							});
						} else if (getApp().globalData.iosPay == 1) {
							console.log(getApp().globalData.iosPay)
							//跳转关注公众号充值
							uni.navigateTo({
								url: '/pages/webview/view'
							});
						} else if (getApp().globalData.iosPay == 2) {
						  uni.showModal({
						  	title: '提示',
						  	content: '由于相关规范，IOS功能暂不可用',
						  	showCancel: false,
						  	success: function(res) {
						  		if (res.confirm) {
						  			console.log('用户点击确定');
						  		} else if (res.cancel) {
						  			console.log('用户点击取消');
						  		}
						  	}
						  });
						}else if(getApp().globalData.iosPay == 3){
							uni.navigateTo({
								url: '/pages/goods/goodr'
							});
						}
					}
				},

			//苹果用户跳转公众号的页面
			goMemberCenters() {
				uni.navigateTo({
					url: '/pages/webview/view'
				});
			},
		
			gowebview() {
				uni.navigateTo({
					url: '/pages/webview/web-view'
				})
			},
			goService() {
				uni.navigateTo({
					// url:'/pages_aiTools/older/older'
					url: '/pages/service/service'
				});
			},
			older(){
				uni.navigateTo({
					url:'/pages_aiTools/older/older'
				})
			},
			/*
			 *	@	跳转到消费记录
			 */
			goConsumption() {
				uni.navigateTo({
					url: '../consumption/consumption'
				});
			},
			/*
			 *	@	跳转帮助
			 */
			goHelp() {
				uni.navigateTo({
					url: '../help/help'
				});
			}
		}
	};
</script>

<style lang="scss" scoped>
	button::after {
		// 清除button默认边框
		border: none;
	}
	/deep/.u-line {
		border: none !important;
	}

	/deep/.u-icon__img {
		// margin-right: 30rpx;
	}
	/deep/.u-cell__title{
		margin-left: 20rpx;
	}

	/deep/.u-cell-group__wrapper {
		padding-top: 30rpx;
		box-sizing: border-box;
		margin-top: 10rpx;
	}

	/deep/.u-cell {
		height: 97rpx;
		display: flex;
		justify-content: center;
		// margin-top: 7rpx;
	}


	/deep/.u-icon__icon {
		font-size: 12px !important;
	}
    /deep/.u-grid.data-v-121efd29 {
		margin-top: 19rpx;
	}

	.grid-text {
		font-size: 12px;
		// color: #909399;
		padding: 8rpx 0 20rpx 0rpx;
		/* #ifndef APP-PLUS */
		box-sizing: border-box;
		/* #endif */
	}

	.version {
		height: 30px;
		width: 90%;
		position: fixed;
		margin: auto;
		bottom: 0;
		/*底部固定*/
		left: 0;
		/*实现div的居中*/
		right: 0;
		/*实现div的居中*/
		text-align: center;
		/*div的内容居中*/
		color: #666666;
		line-height: 30px;
		/*垂直居中*/
	}

	.u-slot-value {
		width: 87rpx;
		height: 38rpx;
	}

	.enlighten_vip {
		position: relative;
		width: 700rpx;
		height: 304rpx;
		margin: 20rpx auto;
		margin-top: 40rpx;
		box-sizing: border-box;
		background: white;

		image {
			width: 100%;
			height: 50%;
		}

		.vip-s {
			height: 170rpx;
			width: 100%;
			background: white;
			border-radius: 20rpx;
			overflow: hidden;
		}

		.button {
			position: absolute;
			top: 39rpx;
			right: 40rpx;
			font-size: 22rpx;
			border-radius: 27rpx;
			color: #333333;
			background-color: #fff;
		}
	}

	.cell_groups {
		width: 696rpx;
		height: 650rpx;
		margin: auto;
		margin-top: 50rpx;
		background-color: #FFFFFF;
		border-radius: 18rpx;
	}

	.cell_group {
		width: 696rpx;
		height: 500rpx;
		margin: auto;

		// background-color: #FFFFFF;
		// border-radius: 18rpx;
		.cell-s {
			background-color: #FFFFFF;
			border-radius: 18rpx;
			width: 696rpx;
			height: 200rpx;
		}

		.cell-c {
			background-color: #FFFFFF;
			border-radius: 18rpx;
			width: 696rpx;
			height: 100rpx;
			margin-top: 30rpx;
		}

		.cell-cs {
			margin-top: 0rpx;
		}

		.cell-v {
			background-color: #FFFFFF;
			border-radius: 18rpx;
			width: 696rpx;
			height: 100rpx;
			margin-top: 30rpx;
		}
	}

	.view {
		border-bottom: 1px solid #efefef;
		height: 1rpx;
		width: 640rpx;
		margin-left: 25rpx;
	}

	.login {
		display: flex;
		align-items: center;
		margin-bottom: 0rpx;
		padding-top: 150rpx;

		.login_portrait {
			margin: 0rpx 42rpx;
			width: 116rpx;
			height: 116rpx;

			image {
				width: 100%;
				height: 100%;
				border-radius: 50%;
			}
		}

		.login_portrait_text {
			.login_portrait_text_ID {
				font-size: 35rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #333333;
				margin-top: 10rpx;
			}

			.login_portrait_text_VIP {
				font-size: 26rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #999999;
				margin-top: 16rpx;
			}
		}

		.refresh {
			margin-left: 100rpx;
			font-size: 22rpx;
			width: 140rpx;
			height: 40rpx;
			border: 1rpx solid #6b9cff;
			border-radius: 12rpx;
			line-height: 40rpx;
			text-align: center;
			color: #6b9cff;
		}
	}

	.box {
		height: 100vh;
		background-color: #f4f4f4;
	}
</style>